<template>
    <!-- 在template 里面，不需要解套，直接使用即可 -->
    <div>{{ money }}</div>
    <button @click="add">点我工资加1000</button>
</template>

<script>
// 注意，记得引进我
import { ref } from 'vue';


/* 
 1. 使用 reactive 只能包裹对象，普通类型不行
 2. ref 转换成响应式对象，script要通过 .value 取值
 3. 在template 里面，不需要解套，直接使用即可
*/
export default {
    setup() {
        const money = ref(15000)
        console.log('money', money.value);
        const add = () => {
            money.value += 1000
        }

        return { money, add }
    },
}
</script>
